<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<!-- <meta name="viewport" content="target-densitydpi=device-dpi,width=750,user-scalable=no" /> -->
	<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
	<title>心灵影院</title>
	<meta http-equiv="cleartype" content="on">
    <meta name="apple-mobile-web-app-title" content="...">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <meta http-equiv="x-rim-auto-match" content="none">
    <meta name="apple-touch-fullscreen" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
	<!-- windows phone 点击无高光 -->
	<meta name="msapplication-tap-highlight" content="no">
	<link rel="stylesheet" type="text/css" href="/css/base.css" />
	<link rel="stylesheet" type="text/css" href="/js/mobile//lib/idangerous.swiper.css" />
	<script type="text/javascript" src="/js/mobile/lib/jquery-1.10.1.min.js"></script>
</head>
<body>
	<div class="main">
		<div class="bg-box bg-box2"  >
			<!-- page title  -->
			<div class="page-title">
				<div class="icon c-back" onclick="window.history.back(-1)"></div>
				<i class="title">我的</i>
				<div class="icon user-exit"   onclick="LoginOut()" id="div_loginOut"></div>
			</div>
			<!-- user info -->
			<div class="user-info" id="ul_login">



				<span class="icon user-himg">	<img id="user_photo" src=""></span>
				<span class="user-name" id="user_name"></span>
			</div>

			<div class="user-info" onclick="ShowLogin()" id="ul_nologin">
				<span class="icon user-himg"></span>
				<span class="user-name">登录</span>
			</div>
		</div>

		<!-- 影片展示 -->
		<div class="moves mmove">
			<div class="m-title">
				<i class="m-type">收藏</i>
				<i class="m-edit" data-edit="false">编辑</i>
			</div>
			<!-- 加载影片列表的容器 -->
			<div class="m-box" id="div_collect">
				<div class="list-box">
					<span class="m-list m-flist">
						<div class="m-img"></div>
						<div class="m-name">180°以南</div>
						<!-- 作品操作 -->
						<div class="work-ops">
							<div class="ops-btn"></div>
							<!-- <div class="ops-m"></div> -->
						</div>
					</span>
					<span class="m-list">
						<div class="m-img"></div>
						<div class="m-name">180°以南</div>
						<div class="work-ops">
							<div class="ops-btn"></div>
						</div>
					</span>
					<span class="m-list m-elist">
						<div class="m-img"></div>
						<div class="m-name">180°以南</div>
						<div class="work-ops">
							<div class="ops-btn"></div>
						</div>
					</span>
				</div>
				<div class="list-box">
					<span class="m-list m-flist">
						<div class="m-img"></div>
						<div class="m-name">180°以南</div>
						<div class="work-ops">
							<div class="ops-btn"></div>
						</div>
					</span>
					<span class="m-list">
						<div class="m-img"></div>
						<div class="m-name">180°以南</div>
						<div class="work-ops">
							<div class="ops-btn"></div>
						</div>
					</span>
					<span class="m-list m-elist">
						<div class="m-img"></div>
						<div class="m-name">180°以南</div>
						<div class="work-ops">
							<div class="ops-btn"></div>
						</div>
					</span>
				</div>
			</div>
			<div class="m-box" id="div_commentfoot">

			</div>
		</div>
		<!-- 用户用于删除的按钮 -->
		<div class="f-user-btn">删除</div>
		<!-- 页面的蒙层 -->
		<!-- <div class="page-m"></div> -->
		<!-- 用户的操作弹层 -->
		<div class="user-ops">
			<div class="ops-list" data-type="true">确认删除</div>
			<div class="ops-list">取消删除</div>
		</div>
	</div>
	<script type="text/javascript" src="/js/mobile/lib/idangerous.swiper.min.js"></script>
	<script type="text/javascript" src="/js/mobile/tools.js"></script>
	<script type="text/javascript" src="/js/mobile/usercenter.js"></script>
	<script type='text/javascript' src='/js/mobile/mobilecom.js' charset='utf-8'></script>
	<script>
        var filmObject = {
            pno: 1,
            pagesize: 6,
            allcount: -1
        }
        if ('${loginstate}'=='login'){
            $('#ul_login').show();
            $('#ul_nologin').hide();

            $('#user_photo').attr('src','${userbaseinfo.fPhoto!}');
            $('#user_name').html('${userbaseinfo.fUsername!}');
            $('#div_loginOut').show();
            //设置信息
            LoadMyCollect();
        }
        else{
            nologin();
        }





        //登录
        function UserLogin(){
            var phone=$('#input_phone').val();
            var pwd=$('#input_pwd').val();
            if (!phone){
                alert('请输入手机号码！');
                return false;
            }
            if (!pwd){
                alert('请输入密码！');
                return false;
            }
            $.ajax({
                type: 'POST',
                url: 'api/user/loginuser',
                data: { phone: phone,password:pwd,loginapp:6},
                dataType: 'json',
                success: function(data){
                    if (data.code=='LoginSucess'){
                        alert('登录成功！');
                        $(".login-reg").fadeOut(100,function(){
                            $(this).remove();
                        });
                        $('#div_loginOut').show();
                        $(".page-m").hide();
                        $('#ul_login').show();
                        $('#ul_nologin').hide();

                        $('#user_photo').attr('src',data.result.fPhoto);
                        $('#user_name').html(data.result.fUsername);
                        LoadMyCollect();
                    }
                    else if (data.code=='NoLogin'||data.code=='LoginFail'){
                        alert("帐号和密码有误，登录失败")
					}
                    else if (data.code=='LoginPassError'){
                        alert('帐号和密码有误，登录失败！');
                    }

                }
            });
        }





        function getHtml(  item) {
            return'<div class="m-img"   onclick="GoToVideoInfo2(\''+item.fObject.fId+'\')">' +
				'<img src="'+item.fObject.fPhoto+'">' +
				'</div>' +
				'<div class="m-name">'+item.fObject.fName+'</div><div class="work-ops" onclick="OpClick('+item.fId+')" id="div_op'+item.fId+'">'+
            	'<div class="ops-btn"></div>'+
            	'</div></span>';
        }
        function LoadMyCollect(){
            $('#div_commentfoot').html('');

            $.ajax({
                type: 'post',
                url:
                '/api/videocount/getmycollectlog?pno='+filmObject.pno+'&pagesize='+filmObject.pagesize+'&allcount=-1',
                dataType: 'json',
                success: function(data){
                    if (mortise_layout.ValidataResult(data)) {
                        var videoList = data.result.list;
                        var dataCount=data.result.count;
                        filmObject.allcount=dataCount;
                        //$('#sp_commentct').html(dataCount);
                        if (videoList && videoList.length > 0) {
                            var _html = '';
                            for (var i=0;i<videoList.length;i+=3){
                                _html+='<div class="list-box">';
                                _html+='<span class="m-list m-flist" >';
                                _html += getHtml(videoList[i]);
                                if (i+1<videoList.length ){
                                    _html+='<span class="m-list m-mlist")">';
                                    _html += getHtml(videoList[i+1]);
                                }
                                if (i+2<videoList.length ){
                                    _html+='<span class="m-list m-elist" >';
                                    _html += getHtml(videoList[i+2]);
                                }
                                _html+='</div>';
                            }
                            if(filmObject.pno==1){
                                $('#div_collect').html(_html);
                            }
                            else{

                                $('#div_collect').append(_html);
                            }
                            if (dataCount>( filmObject.pno)* filmObject.pagesize){
                                $('#div_commentfoot').html('<span class="get-more-data"  style="cursor:pointer" onclick="loadMore()">点击加载更多...</span>');
                            }
                            else{
                                //over
                                $('#div_commentfoot').html('<span class="get-more-data" >没有数据了...</span>');
                            }
                        }
                        else{
                            $('#div_collect').html('没有数据了！');
                        }

                    }

                }
            });
		}
        function loadMore() {
            filmObject.pno++;
            LoadMyCollect();
        }
        function LoginOut(){
            $.ajax({
                type: 'post',
                url: '/api/user/loginout',
                dataType: 'json',
                success: function (data) {
                    if (mortise_layout.ValidataResult(data)) {
                        //{"code":"OperateOk","errorMsg":"","result":null,"allcount":0}
                        if (data.code=='OperateOk'){
                            nologin();
                        }
                        else{
                            alert('操作失败');
                        }
                    }
                }
            });
        }
        function  nologin() {
            $('#ul_login').hide();
            $('#ul_nologin').show();
            $('#div_loginOut').hide();
            $('#div_commentfoot').html('');
            $('#div_collect').html("<span style='color: #FFFFFF'>请<span onclick='ShowLogin();'>登录</span>后查看</span>")
        }
		function  OpClick(id) {
			$('#div_op'+id).toggleClass("active");
        }
        
        function GoToVideoInfo2(_link) {
            //var _link = $(this).atte("data-link");
            //
			if( $(".m-edit").attr("data-edit") == "true") return false;//属性不存在的时候 || 当处于编辑状态的时候  没有效果

              window.location.href ='/video?fid='+ _link;
        }

	</script>
</body>
</html>